<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="utf-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <link rel="shortcut icon" href="/cwp/favicon.ico" type="image/x-icon" />
    <title>能耗管理</title>
    <!--引入CSS文件-->
    <link rel="stylesheet" type="text/css" href="../../assets/css/styles/style.css" />
    <link rel="stylesheet" type="text/css" href="../../assets/css/styles/components-css/list.css" />
    <link rel="stylesheet" type="text/css" href="../../assets/css/styles/components-css/table.css" />
    <link rel="stylesheet" type="text/css" href="../../assets/css/styles/components-css/paging.css" />
    <link rel="stylesheet" type="text/css" href="../../assets/css/styles/components-css/btn.css" />
    <link rel="stylesheet" type="text/css" href="../../assets/css/styles/components-css/taqs.css" />
    <link rel="stylesheet" type="text/css" href="../../assets/css/styles/components-css/tabs.css"/>
    <link rel="stylesheet" type="text/css" href="../../assets/css/styles/components-css/panel.css" />
    <link rel="stylesheet" type="text/css" href="../../assets/lib/bootstrap-3.3.5-dist/css/bootstrapModel.css" />

</head>
<body>
<!--头部文件 开始-->
<div id="header"></div>
<!--头部文件 结束-->

<div class="wrapper">
    <!--左侧菜单 开始-->
    <div id="left-menu"></div>
    <!--左侧菜单 结束-->
    <!--右侧内容 开始-->
    <div class="right-container">
        <div class="right-scroll">
            <div class="t-list">
                    <div class="t-list-title">
                        <h2>运营监控 > 用电能耗</h2>
                    </div>
                <div class="t-tabs">
                    <ul id="myTabs" class="t-tabs-items">
                        <li class="active"><a id="powerTrends" href="#tab1" data-toggle="tab">用电趋势</a></li>
                        <li><a href="#tab2" data-toggle="tab">楼栋用电</a></li>
                    </ul>
                    <div id="myTabContent" class="tab-content">
                        <!--用电趋势-->
                        <div class="tab-pane fade in active" id="tab1">
                            <div class="t-list-search t-columns-4">
                                <!-- 检索字段 -->
                                <ul class="t-columns-group">
                                    <li class="timegroup">
                                        <label>请选择年：</label>
                                        <div>
                                            <select type="text" id="cmbYear">
                                                <option value="">请选择</option>
                                                <option value="2017" selected>2017年</option>
                                                <option value="2016">2016年</option>
                                                <option value="2015">2015年</option>
                                            </select>
                                        </div>
                                    </li>
                                    <li class="timegroup">
                                        <label>请选择月：</label>
                                        <div>
                                            <select type="text" id="cmbMonth">
                                                <option value="">请选择</option>
                                                <option value="1">1月</option>
                                                <option value="2">2月</option>
                                                <option value="3">3月</option>
                                                <option value="4">4月</option>
                                                <option value="5">5月</option>
                                                <option value="6">6月</option>
                                                <option value="7">7月</option>
                                                <option value="8">8月</option>
                                                <option value="9">9月</option>
                                                <option value="10">10月</option>
                                                <option value="11">11月</option>
                                                <option value="12">12月</option>
                                            </select>
                                        </div>
                                    </li>
                                    <!-- 时间组 -->
                                    <li>
                                        <label>&nbsp;</label>
                                        <div>
                                            <a class="t-btn btnSearch" id="btnSearchAlarm">
                                                <i class="icon-search"></i>
                                                查询
                                            </a>
                                        </div>
                                    </li>
                                </ul>
                            </div>

                            <div class="t-panel" id="powerTrendsEcharts"></div>

                        </div>
                        <!--楼栋用电-->
                        <div class="tab-pane fade" id="tab2">
                            <div class="t-list-search t-columns-1">
                                <!-- 检索字段 -->
                                <ul class="t-columns-group">
                                    <li class="with-all">
                                        <div>
                                            本年所有楼栋耗电量（可以点击柱状图显示对应楼栋耗电量及设备耗电对比）
                                        </div>
                                    </li>
                                </ul>
                            </div>

                            <div class="t-panel" id="banPower" style="height:350px;">

                            </div>

                            <div class="t-list-3">
                                <ul class="clearfix">
                                    <li lang="two">
                                        <div class="box-padding">
                                            <div class="t-box">
                                                <div class="t-box-title">CC-1</div>
                                                <div class="t-box-body" id="banPowermonth">

                                                </div>
                                            </div>
                                        </div>
                                    </li>
                                    <li lang="two">
                                        <div class="box-padding">
                                            <div class="t-box">
                                                <div class="t-box-title">
                                                    设备用电比
                                                </div>
                                                <div class="t-box-body" id="devicesPowerCompared">

                                                </div>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--右侧内容 结束-->
</div>

<!--版权-->
<div id="copyright"> </div>

<!--提示模态框-->
<div class="modal fade bs-example-modal-sm" id="myTip" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
    <div class="modal-dialog modal-sm" role="document">
        <div class="modal-content">
            <div class="modal-body" style="text-align:center;font-size:14px;">
                <i id="icon-tip" style="margin-right:6px;"></i>
                <span class="tip-info"></span>
            </div>
        </div>
    </div>
</div>

<!--jQuery库脚本-->
<!--非IE8浏览器-->
<!--[if !(IE 8)]><!--><script type="text/javascript" src="../../assets/lib/jquery/jquery.min.js"></script><!--<![endif]-->
<!--IE8浏览器-->
<!--[if IE 8]><script type="text/javascript" src="../../assets/lib/jquery/jquery-ie8.min.js"></script><![endif]-->
<script type="text/javascript" src="../../assets/lib/jQuery-slimScroll-1.3.8/jquery.slimscroll.min.js"></script>
<script charset="utf-8" src="../../assets/common/loadHeaderAndCopyright.js"></script>

<!--启用模态框脚本-->
<script charset="utf-8" src="../../assets/lib/bootstrap-3.3.5-dist/js/bootstrap.js"></script>

<script charset="utf-8" src="../../assets/common/centerModal.js"></script>
<script charset="utf-8" src="../../assets/lib/tipModal/js/tipModal.js"></script>
<!--数据交互公用脚本-->
<script charset="utf-8" src="../../assets/common/ajaxPoster.js"></script>
<script charset="utf-8" src="../../assets/common/loaderTable.js"></script>
<script charset="utf-8" src="../../assets/lib/chart/dist/echarts-all.js"></script>
<script charset="utf-8" src="../../js/energyManagement/energy.js"></script>

</body>
</html>